@charset "utf-8";
@import "compass";
$experimental-support-for-svg: true;

/* const */

$bodyWidthNum:1001;
$bodyWidth:#{$bodyWidthNum}px;

$sideGap:10px;

$footerWidth:100%;
$footerHeight:30px;

$linkColor:#c02126;
$lightTextColor:#757373;

/* layout */

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display:block }

html, body, div {
  margin: 0;
  padding: 0;
}

html, body {
	height: 100%;
	width: 100%;
	min-width:$bodyWidth;
	min-height:723px;
}

* html body {
	width:expression(document.documentElement.clientWidth < #{$bodyWidthNum} ? '#{$bodyWidth}' : '100%');
	height:expression(document.documentElement.clientHeight < 550 ? '550px' : '100%');
	text-align:center;
}

#wrapper {
	position:relative;
	width:$bodyWidth;
	margin:0 auto;
	min-height:100%;
	overflow-x:visible;

	height:auto !important;

	text-align:left;
	
	height /*\**/: 700px\9 /* workaround for the buggy ie8 */
}

* html #wrapper { height:100% }


#container { 
	width:$bodyWidth;
	margin:0 (-$sideGap);
	padding:0 $sideGap 0;

	min-height:700px;
	_height:700px;
}

/* footer */

.footer-placeholder {
	min-height:$footerHeight;
	_height:$footerHeight;
}

#footer {
	position:relative;
	height:$footerHeight;
	width:$footerWidth;
	margin: -$footerHeight 0 0;
	text-align:left;
}

.clearer {
	display:block;
	float:none !important;
	clear: both;
	width:0; height:0;
	margin:0; padding:0;
	line-height:0;
	font-size:0;
	visibility:hidden;
}
* html .clearer { display:inline; }


/*** fonts ***/

@font-face {
    font-family: 'MyriadPro';
    src: url('myriadpro-regular-webfont.eot');
    src: url('myriadpro-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('myriadpro-regular-webfont.woff') format('woff'),
         url('myriadpro-regular-webfont.ttf') format('truetype'),
         url('myriadpro-regular-webfont.svg#MyriadProLight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MyriadPro';
    src: url('myriadpro-it-webfont.eot');
    src: url('myriadpro-it-webfont.eot?#iefix') format('embedded-opentype'),
         url('myriadpro-it-webfont.woff') format('woff'),
         url('myriadpro-it-webfont.ttf') format('truetype'),
         url('myriadpro-it-webfont.svg#MyriadProItalic') format('svg');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'MyriadProLight';
    src: url('myriadpro-light-webfont.eot');
    src: url('myriadpro-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('myriadpro-light-webfont.woff') format('woff'),
         url('myriadpro-light-webfont.ttf') format('truetype'),
         url('myriadpro-light-webfont.svg#MyriadProLight') format('svg');
    font-weight: normal;
    font-style: normal;
}


/***************** decor ********************/

/***************** decor ********************/

img { border:none; }
.drop-img { margin-right:8px; }

a { color:#c02126 }
a:hover { color:#f00; }

a.button {
	margin: 8px 0;
	padding:6px 10px;
	color: #222;
	text-decoration:none;
	background:#ddd;

	-moz-border-radius: 10px; /* Firefox */
	-webkit-border-radius: 10px; /* Safari, Chrome */
	border-radius: 10px; /* CSS3 */

	&:hover { color:#fff; background:#c02126; }
	}

a.switch {
	@extend a.button;
	color:#c02126;
	background:#fff;

	&.active {
		color: #222;
		background:#ddd;
	}
}

p { margin:0 0 8px 0; }

li { margin:0 0 4px 0; line-height:auto; }

ul { padding:0 0 0 40px }

h1 {
	font-size:24px;
	line-height:1.2em;
	font-weight:bold;
	margin:16px 0;
}

h2 {
	font-size:18px;
	line-height:1.2em;
	font-weight:bold;
	margin:30px 0;
	color:#000;
}

h3 {
	font-size:13px;
	font-weight:normal;
	margin:1em 0 0.2em;
	color:#9f0e05;
}

h4 {
	font-size:12px;
	line-height:1.2em;
	font-weight:bold;
	margin:0 0 20px 0;
	color:#9f0e05;
}

h5 {
	font-size:10px;
	font-weight:bold;
	margin:0 0 20px 0;
	color:#f90;
}

.separated { margin:5px 0; font-size:14px; }

#login-block {
	width:300px;
	margin:30px auto;
	padding:1px 0 1px 40px;
	background:rgba(255,255,255,0.75);
}

.contact-input { width:300px }

.div-right { float:right; margin-left:14px; margin-bottom:10px; }
.div-left { float:left; margin-right:14px; margin-bottom:10px; }
.div-clear { clear:both; visibility:hidden; height:0; font-size:0; line-height:0; }
.div-just-clear { clear:both }

.error { color:#f00 }
.success { color:#060 }

.no-hidden { overflow:visible !important; }

table.table { border-collapse:collapse; border:1px solid #777; font-size:11px; line-height:1.4em; }
table.table td { padding:3px 6px; border:1px solid #777; }
table.table thead td, tr.inverted {
	background-color:#800;
	color:#fff;
	font-weight:bold;
}
table.table p { margin:0 0 4px 0 }


.column-left {
	float:left;
	display:inline;
	width:45%;
	margin-right:7%;
}

.column-right {
	float:right;
	display:inline;
	width:45%;
	margin-left:7%;
}

.column-narrow {
	float:left;
	display:inline;
	width:30%;
	margin-right:7%;
}

.column-free {
	overflow:hidden;
}



/***************** layout ********************/

.main {
	float:right;
	display:inline;
	width:100%;
	margin:0 0 0 -224px;
	min-height:723px;
	font-family:Verdana, Geneva, sans-serif;
	
	* html & { height:723px }
	
	.content { margin:0 0 0 224px; }
	}
	

.sidebar {
	float:left;
	display:inline;
	width:224px;
	margin:0;
	}

/***************** all ********************/


body {
	color:#000;
	font: 11px/1.2em Arial, Helvetica, Tahoma, sans-serif;
	text-align:center;
	background:#fff;
}

footer {
	height:34px;
	text-align:left;
	}

nav {
	display:inline;
	line-height:34px;
	
	ul {
		display:inline;
		list-style:none none;
		margin:0 0 0 5px;
		padding:0;
		
		li {
			display:inline;
			margin:0 10px 0 0;
			color:#222;
			font: italic 12px/34px Arial, Helvetica, Tahoma, sans-serif;
			
			strong {
				font-weight:normal;
				}
			}
		}
	}

.copyright { display:inline }

.sidebar {
	
	.logo {
		width:219px;
		height:238px;
		margin:109px 0 0;
		
		a {
			display:block;
			width:100%;
			height:100%;
			background:url(/img/phoenix-logo.png) no-repeat left top;
			
			span { display:none }
			}
		}
	}